﻿<Window
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	x:Class="SuperCalendar.MainWindow"
	x:Name="Window" 
	Width="250" Height="100" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
	xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  WindowStyle="None" 
	Background="{x:Null}"  AllowsTransparency="True"  MouseLeftButtonDown="DragWindow">
    <Window.Resources>
        <Style x:Key="Main.Back" TargetType="{x:Type Border}">
            <Setter Property="Border.Background" Value="#BF0000FF" />
            <Setter Property="Border.Opacity" Value="0.7" />
            <Setter Property="Border.Height" Value="100" />
            <Setter Property="Border.Width" Value="250" />
            <Setter Property="Border.BorderBrush" Value="#7FFFFFFF"  />
            <Setter Property="Border.CornerRadius" Value="5" />
            <Setter Property="Border.BorderThickness" Value="1" />
        </Style>
        <Style x:Key="Header" >
            <Setter Property="Control.Height" Value="45" />
            <Setter Property="Control.Background" Value="#7FFFFFFF" />
        </Style>
        <Style x:Key="Header.CurrentTimeStyle" >
            <Setter Property="Control.FontSize" Value="25" />
            <Setter Property="Control.FontWeight" Value="Bold" />
            <Setter Property="Control.Foreground" Value="#FFFFFFFF" />
            <Setter Property="Control.HorizontalContentAlignment" Value="Center" />
            <Setter Property="Control.FontFamily" Value="Arial" />
        </Style>
        <Style x:Key="Header.CurrentEventStyle"  TargetType="{x:Type Label}">
            <Setter Property="Label.Foreground" Value="#FFFFFFFF" />
            <Setter Property="Label.HorizontalContentAlignment" Value="Left" />
            <Setter Property="Label.ClipToBounds" Value="True" />
        </Style>

        <Ellipse x:Key="YelloDot" Width="6" Height="6" Fill="Yellow" />

        <Style x:Key="ToolButton"  TargetType="{x:Type Button}">
            <Setter Property="VerticalAlignment" Value="Bottom" />
            <Setter Property="Height" Value="50"/>
            <Setter Property="Width" Value="50" />
            <Setter Property="LayoutTransform">
                <Setter.Value>
                    <ScaleTransform />
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <EventTrigger RoutedEvent="Button.MouseEnter" >
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="LayoutTransform.ScaleX" To="2" Duration="0:0:0.25" />
                                <DoubleAnimation Storyboard.TargetProperty="LLayoutTransform.ScaleY" To="2" Duration="0:0:0.25" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger.Actions>
                </EventTrigger>
                <EventTrigger RoutedEvent="Button.MouseLeave">
                    <EventTrigger.Actions>
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetProperty="LayoutTransform.ScaleX" To="1" Duration="0:0:0.25" />
                                <DoubleAnimation Storyboard.TargetProperty="LLayoutTransform.ScaleY" To="1" Duration="0:0:0.25" />
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger.Actions>
                </EventTrigger>
            </Style.Triggers>
        </Style>

    </Window.Resources>

    <Grid x:Name="LayoutRoot">
        <Border Style="{StaticResource Main.Back}" />
        <StackPanel>
            <DockPanel x:Name="Header"  Style="{StaticResource Header}">
                <Label x:Name="CurrentTime" DockPanel.Dock="Left" Content="Time" Margin="5" Style="{StaticResource Header.CurrentTimeStyle}" />
                <StaticResource  ResourceKey="YelloDot" />
                <Label x:Name="CurrentEvent" Margin="10" Content="No Event,Take a break" Style="{StaticResource Header.CurrentEventStyle}" />
            </DockPanel>
            <StackPanel Orientation="Horizontal" >
                <Button Style="{StaticResource ToolButton}">1</Button>
                <Button  Style="{StaticResource ToolButton}">2</Button>
            </StackPanel>

        </StackPanel>


    </Grid>
</Window>